<template>
  <div class="homebox">
    <img src="@/assets/images/bjd.png" alt="" class="bjd" />
    <!-- <div class=""></div> -->
    <Headmain :ymbsid="ymbsid" />
    <!-- 日期选择 -->
    <div class="date-switcher" v-if="!addFormshow">
      <span class="date-display">{{ formattedDate }}</span>
    </div>

    <!-- 数据概览 -->
    <div class="desbox" v-if="!addFormshow">
      <div @click="gobackfn" class="prebox">
        <div class="tool preimg">
          <img src="@/assets/images/preac.png" alt="" class="active" />
          <img src="@/assets/images/pre.png" alt="" class="normal" />
        </div>
        <div>返回上一页</div>
      </div>
      <div class="desbox1">
        <div class="bsdiv1">已结束：{{ result.ended }}人</div>

        <div class="bsdiv2">进行中：{{ result.ongoing }}人</div>

        <div class="bsdiv3">未开始：{{ result.notStarted }}人</div>
        <div class="bsdiv4">锁定</div>
      </div>
    </div>

    <div class="moveboxmain" v-if="moveshow">
      <div class="movebox" @click="moveshow = false">
        <img src="@/assets/images/cose2.png" alt="" class="class2" />
        <div class="movetitel">未到人员列表</div>
        <div class="moveboxitem">
          <a-table
            :columns="columns"
            :data="noSigndata"
            :pagination="paginations"
            @page-change="onPageChanges"
            @page-size-change="onPageSizeChanges"
        /></div>
        <div class="movebottom">
          <div class="moveqx" @click="moveshow = false">取消</div>
          <div class="moveqr" @click="moveshow = false">确认</div>
        </div>
      </div>
    </div>
    <!-- 日排版 显示 -->
    <div class="dayboxmain" v-if="!addFormshow">
      <div class="dayboxt">
        <div class="desbox1">
          <div class="nameleft">未到人员：</div>
          <div class="namebox">
            <span>
              <template v-for="(item, index) in noSigndata">
                {{ item.patientName
                }}<span v-if="index < noSigndata.length - 1">、</span>
              </template>
            </span>
          </div>
          <!-- v-if="noSigndata.length > 0" -->
          <div class="namemovebt" @click="moveshow = true"
            >查看更多
            <img
              src="@/assets/images/chevron-left.png"
              alt=""
              class="chevron-left"
            /> </div
        ></div>
      </div>
      <div class="daybox">
        <div class="dayboxleft">
          <div class="dayboxlefttop">时间段</div>
          <div class="dayboxbottom">患者</div>
        </div>
        <div class="dayboxright beautifulScroll">
          <div class="dayboxrighttop">
            <div
              class="daytimeitem"
              v-for="(item, index) in timerdata"
              :key="index"
            >
              <div
                class="daytimeritembox"
                :class="getStatusClass(item, formattedDate)"
                >{{ item }}</div
              >
            </div>
          </div>
          <div class="dayboxrightbottom">
            <div
              class="dayboxbottomitem"
              v-for="(item, index) in timerdata"
              :key="index"
            >
              <div
                v-if="
                  matchedData[item]?.length && checkTime(item) != '时间已锁定'
                "
              >
                <!--   @click="gohuanzhe(entry)" -->
                <div
                  v-for="(entry, idx) in matchedData[item]"
                  :key="idx"
                  class="patient-item"
                  :class="[
                    idx < matchedData[item].length - 1 || idx == 0
                      ? 'patient-items'
                      : '',
                    getStatusClass(item, formattedDate),
                  ]"
                >
                  <div class="hzshowbox" v-if="entry.patientName">
                    <div class="patienticon">
                      <img
                        src="@/assets/images/statusicon.png"
                        alt=""
                        v-if="getStatusClass(item, formattedDate) === 'before'"
                      />
                      <img
                        src="@/assets/images/after.png"
                        alt=""
                        v-if="getStatusClass(item, formattedDate) === 'after'"
                      />
                      <img
                        src="@/assets/images/orign.png"
                        alt=""
                        v-if="getStatusClass(item, formattedDate) === 'during'"
                      />
                    </div>
                    <div class="patientdesbox" v-if="entry.patientName">
                      <div class="patientName">{{ entry.patientName }}</div>
                      <div class="patientstatus">
                        {{
                          getStatusClass(item, formattedDate) === 'after'
                            ? '未开始'
                            : getStatusClass(item, formattedDate) === 'before'
                            ? '已结束'
                            : getStatusClass(item, formattedDate) === 'during'
                            ? '进行中'
                            : ''
                        }}</div
                      >
                    </div>
                  </div>
                </div>
              </div>
              <!-- 只作为 数据锁定的判断了，不进行无患者的判断了 -->
              <div v-else class="no-data">
                <div class="no-datas">
                  <div
                    class="suodingimg"
                    v-if="checkTime(item) == '时间已锁定'"
                  >
                    <img src="@/assets/images/suoding.png" alt="" />
                  </div>
                  <div>{{
                    checkTime(item) == '时间已锁定' ? '锁定中' : ''
                  }}</div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <!-- 患者详细信息 -->
    <!-- -->
    <div class="container" v-if="addFormshow">
      <div @click="addFormshow = false" class="prebox">
        <div class="tool preimg">
          <img src="@/assets/images/preac.png" alt="" class="active" />
          <img src="@/assets/images/pre.png" alt="" class="normal" />
        </div>
        <div>返回上一页</div>
      </div>
      <!-- 患者详情 -->
      <div class="dayhzboxmain">
        <div class="dayhzbox">
          <div class="dayhzmain">
            <div class="dayhzimg">
              <img src="@/assets/images/hztx.png" alt="" />
            </div>
            <div class="dayhzdesbox">
              <div class="dayhznamebox dayhznameboxs">
                <div class="dayhznamelabel">姓名</div>
                <div class="dayhzname">{{ addForm.patientName }}</div>
              </div>
              <div class="dayhznamebox">
                <div class="dayhznamelabel">性别</div>
                <div class="dayhzname">
                  {{ addForm.patientSex == 'F' ? '男' : '女' }}</div
                >
              </div>
              <div class="dayhznamebox">
                <div class="dayhznamelabel">身份证号</div>
                <div class="dayhzname">{{ addForm.idCard }}</div>
              </div>
              <div class="dayhznamebox">
                <div class="dayhznamelabel">联系方式</div>
                <div class="dayhzname"> {{ addForm.mobile }}</div>
              </div>
              <div class="dayhznamebox">
                <div class="dayhznamelabel">患者年龄</div>
                <div class="dayhzname"> {{ addForm.patientAge }}</div>
              </div>
              <div class="dayhznamebox">
                <div class="dayhznamelabel">床位号</div>
                <div class="dayhzname">{{ addForm.bedNumber }}</div>
              </div>
            </div>
          </div>
          <div class="dayhzbz"> <span>备注: </span> {{ addForm.remark }} </div>
        </div>
        <div class="dayhzyybox">
          <div class="dayhzyytitlte">
            <img src="@/assets/images/titlebj.png" alt="" class="titlebj" />
            <img src="@/assets/images/titleicon.png" alt="" class="titleicon" />
            <div>预约信息</div>
          </div>
          <div class="dayhzyydesbox">
            <div class="dayhznamebox dayhznameboxs">
              <div class="dayhznamelabel" style="color: #666666">接待部门</div>
              <div class="dayhznames"
                >{{ userdata.groupName }} - {{ userdata.attribute }}</div
              >
            </div>
            <div class="dayhznamebox dayhznameboxs">
              <div class="dayhznamelabel" style="color: #666666">预约时间</div>
              <div class="dayhznames"> {{ addForm.date }}</div>
            </div>
            <div class="dayhznamebox dayhznameboxs">
              <div class="dayhznamelabel" style="color: #666666">是否已到</div>
              <div class="dayhznames">{{
                addForm.signStatus == '9' ? '未签到' : '已签到'
              }}</div>
            </div>
          </div>
        </div>
      </div>
      <div class="zlpgbox">
        <div class="dayhzyytitlte">
          <img src="@/assets/images/titlebj.png" alt="" class="titlebj" />
          <img src="@/assets/images/iconzl.png" alt="" class="titleicon" />
          <div>治疗评估</div>
        </div>
        <div class="zlpglib">
          <a-table
            ref="userList"
            row-key="userId"
            :loading="loading"
            page-position="bottom"
            :pagination="pagination"
            v-model:selectedKeys="userIds"
            :columns="column"
            :data="renderData"
            :bordered="false"
            @page-change="onPageChange"
            @page-size-change="onPageSizeChange"
          >
            <template #treatmentPlanId="{ record }">
              <div style="color: blue" @click="goevaluation(record)">详情</div>
            </template>
          </a-table>
        </div>
      </div>

      <div class="signbox" @click="signfn(1)" v-if="addForm.signStatus == '9'"
        ><div>手动确认</div><div>患者签到</div></div
      >
      <!-- 是否 addForm.signStatus -->
      <div class="signbox" @click="signfn(2)"><div>后续预约</div></div>
      <!-- 弹窗提示确认 -->
      <div class="moveboxmain" v-if="visibleshow">
        <div class="movebox">
          <!-- <img src="@/assets/images/cose2.png" alt="" class="class2" /> -->
          <div class="movetitel">提示</div>
          <div class="moovenr">{{ tipstext }}</div>
          <div class="movebottom">
            <div class="moveqx" @click="visibleshow = false">取消</div>
            <div class="moveqr" @click="signfner">确定</div>
          </div>
        </div>
      </div>
      <!-- <a-modal
        :visible="visibleshow"
        @ok="handleOk"
        okText="不需要了"
        cancelText="继续治疗"
        unmountOnClose
      >
        <template #title> 提示 </template>
        <div></div>
      </a-modal> -->
    </div>
    <!-- 治疗评判 -->
    <a-modal
      v-model:visible="Evaluationshow"
      :mask-closable="false"
      unmountOnClose
      width="800px"
    >
      <template #title> 治疗项目</template>
      <div class="zlbox">
        <div class="table">
          <div class="row">
            <div class="cell cellpjt">治疗师信息</div>
            <div class="cell colspan-4 divd">
              <div>分组:</div>
              <div>治疗师:</div>
              <!-- <div>提交时间2024-11-27 11:08</div> -->
            </div>
          </div>
          <div class="row">
            <div class="cell cellpjt">综合评判</div>
            <div class="cell colspan-4">
              {{ Evaluationdata.evaluation }}
            </div>
          </div>

          <div v-for="(item, index) in Evaluationdata.list" :key="index">
            <div class="row">
              <div class="cell colspan-4">治疗内容项目</div>
              <div class="cell cellpj">优秀</div>
              <div class="cell cellpj">良好</div>
              <div class="cell cellpj">较差</div>
            </div>
            <div class="row">
              <div class="cell colspan-4">{{ item.content }}</div>
              <div class="cell cellpj"
                ><icon-check style="color: green" v-if="item.good == 1"
              /></div>
              <div class="cell cellpj"
                ><icon-check style="color: green" v-if="item.poor == 1"
              /></div>
              <div class="cell cellpj"
                ><icon-check style="color: green" v-if="item.good == 1"
              /></div>
            </div>
          </div>
        </div>
      </div>
    </a-modal>
  </div>
</template>

<script lang="ts" setup>
  import { ref, reactive, computed } from 'vue';
  import Headmain from '../headmain/headmain.vue';
  import { useRouter } from 'vue-router';
  import {
    noSign,
    getTimeList,
    dayPlan,
    patientInfo,
    sign,
    saveEvaluation,
    evaluationList,
    evaluation,
    stopTreatment,
    restList,
  } from '@/api/home';
  import useLoading from '@/hooks/loading';
  import { Message, Modal } from '@arco-design/web-vue';
  import { storeToRefs } from 'pinia';
  import type { TableColumnData } from '@arco-design/web-vue/es/table/interface';
  import { useSelectionStore, useUserStore } from '@/store';
  const { loading, setLoading } = useLoading(true);
  import { useRoute } from 'vue-router';
  const resttimer = ref([]);
  const userStore = useUserStore();
  const userdata = storeToRefs(userStore);
  const router = useRouter();
  const restListfn = (startDate: Date, endDate: Date) => {
    restList({
      pageNum: 1,
      pageSize: 200,
      startDate: startDate,
      endDate: endDate,
    }).then((res) => {
      if (res.code == 200) {
        resttimer.value = res.data.list;
      }
    });
  };
  const route = useRoute();
  // 定义当页面标识
  const ymbsid = ref('2');
  // 定义详情人概览
  const moveshow = ref(false);
  const columns = [
    {
      title: '患者姓名',
      dataIndex: 'patientName',
    },
    {
      title: '开始时间',
      dataIndex: 'startTime',
    },
    {
      title: '结束时间',
      dataIndex: 'endTime',
    },
  ];
  // 获取当日日期
  const currentDate = ref();
  currentDate.value = new Date(route.query.date);
  // 创建当日日期后 查询当日 未到人员
  // 定义未到人员
  // 定义统计
  const result = ref({
    ongoing: 0,
    ended: 0,
    notStarted: 0,
  });
  const noSigndata = ref();
  const formattedDates = ref();
  // 定义无用参数3
  const basePaginations: Pagination = {
    current: 1,
    pageSize: 7,
    total: 0,
  };
  const paginations = reactive({
    ...basePaginations,
    'hide-on-single-page': true,
    'show-total': true,
    'show-jumper': true,
    'show-page-size': true,
  });
  const noSignfn = () => {
    const date = new Date(currentDate.value);
    // 获取所需格式的日期字符串
    formattedDates.value = `${date.getFullYear()}-${String(
      date.getMonth() + 1
    ).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')}`;
    // 进行请求
    noSign({
      date: formattedDates.value,
      pageNum: paginations.current,
      ...paginations,
    }).then((res) => {
      if (res.code == 200) {
        noSigndata.value = res.data.list;
        paginations.total = res.data.total;
        paginations.current = res.data.pageNum;
      }
    });

    dayPlan({ date: formattedDates.value }).then((res) => {
      if (res.code == 200) {
        dayplandata.value = res.data;
        // noSigndata.value = res.data;
        result.value = getPatientStatus(dayplandata.value, currentDate.value);
      }
    });
    restListfn(formattedDates.value, formattedDates.value);
  };
  noSignfn();
  // 查询未到人员列表
  const noSignList = () => {
    const date = new Date(currentDate.value);
    const formattedDates = `${date.getFullYear()}-${String(
      date.getMonth() + 1
    ).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')}`;
    noSign({
      date: formattedDates,
      pageNum: paginations.current,
      ...paginations,
    }).then((res) => {
      if (res.code == 200) {
        noSigndata.value = res.data.list;
        paginations.total = res.data.total;
        paginations.current = res.data.pageNum;
      }
    });
  };
  const onPageChanges = (current: number) => {
    paginations.current = current;
    noSignList();
  };
  const onPageSizeChanges = (pageSize: number) => {
    paginations.pageSize = pageSize;
    noSignList();
  };
  // 定义获取时间段
  const timerdata = ref();
  const dayplandata = ref();
  const getTimeListfn = () => {
    getTimeList().then((res) => {
      if (res.code == 200) {
        timerdata.value = res.data;
      }
    });
  };
  getTimeListfn();
  // 格式化日期为 YYYY年MM月DD日
  const formattedDate = computed(() => {
    const year = currentDate.value.getFullYear();
    const month = String(currentDate.value.getMonth() + 1).padStart(2, '0');
    const day = String(currentDate.value.getDate()).padStart(2, '0');
    return `${year}年${month}月${day}日`;
  });

  // 修改日期
  const changeDate = (offset: number) => {
    // 创建新日期对象以替换 currentDate 的引用
    const newDate = new Date(currentDate.value);
    newDate.setDate(newDate.getDate() + offset);
    currentDate.value = newDate; // 替换引用，触发响应式更新

    // console.log('执行了修改日期', currentDate.value);
    // 修改日期后操作
    // 查询最新未到人员列表
    noSignfn();
  };

  // 匹配 dayplandata 和 timerdata
  const matchedData = computed(() => {
    const result: { [key: string]: PatientData[] } = {};

    // 将原始数据按照时间范围进行分组
    timerdata.value.forEach((timeRange) => {
      const [start, end] = timeRange.split('-');
      result[timeRange] = [];
      if (!dayplandata.value) {
        return;
      }
      Object.keys(dayplandata.value).forEach((key) => {
        if (key >= start && key < end) {
          result[timeRange].push(...dayplandata.value[key]);
        }
      });
      for (let i = 0; i < 6; i++) {
        result[timeRange].push({});
      }
    });

    // 找到所有数组中最长的长度
    const maxLength = Math.max(
      ...Object.values(result).map((data) => data.length)
    );

    // 为每个数组补充空数据，使长度与最长数组一致
    Object.keys(result).forEach((timeRange) => {
      const currentLength = result[timeRange].length;
      for (let i = currentLength; i < maxLength; i++) {
        if (checkTime(timeRange) != '时间已锁定') {
          result[timeRange].push({});
        } else {
          result[timeRange] = [];
        }
        // 补充空数据
      }
    });

    console.log('处理之后的户数', result);

    return result;
  });

  // 去查看患者详情
  const patientTreatmentId = ref();

  const gohuanzhe = (item: any) => {
    patientTreatmentId.value = item.patientTreatmentId;
    console.log('当前患者', item);
    patientInfo({
      patientId: item.patientId,
    }).then((res) => {
      if (res.code == 200) {
        addForm.value = res.data;
        addForm.value.signStatus = item.signStatus;
        addForm.value.date =
          formattedDates.value + ' ' + item.startTime + '~' + item.endTime;
        addForm.value.patientTreatmentId = item.patientTreatmentId;
      }
    });
    fetchData();
    addFormshow.value = true;
  };
  // 查询患者的评估列表

  const fetchData = async () => {
    setLoading(true);
    try {
      evaluationList({
        patientTreatmentId: patientTreatmentId.value,
      }).then((res) => {
        if (res.code == 200) {
          renderData.value = res.data.list;
        }
      });
    } catch (err) {
      console.log(err);
    } finally {
      setLoading(false);
    }
  };
  // 定义患者信息
  const addForm = ref({
    createTime: '',
    createUser: '',
    idCard: '',
    mobile: '',
    patientAge: '',
    patientId: '',
    patientName: '',
    patientSex: '',
    treatment: false,
    treatmentNumber: '',
    signStatus: '',
    date: '',
    patientTreatmentId: '',
  });
  // 定义自定义提示词
  const tipstext = ref();
  // 签到
  const signfn = (i) => {
    if (i == 1) {
      tipstext.value =
        addForm.value.patientName +
        '已到，' +
        '我已核对' +
        addForm.value.patientName +
        '已到场';
    }
    if (i == 2) {
      tipstext.value = '该病患是否需要继续治疗？';
    }
    visibleshow.value = true;
  };
  const signfner = () => {
    if (tipstext.value == '该病患是否需要继续治疗？') {
      visibleshow.value = false;
    } else {
      sign({
        treatmentPlanId: addForm.value.patientTreatmentId,
      }).then((res) => {
        if (res.code == 200) {
          console.log('签到成功');
        }
      });
      visibleshow.value = false;
    }
  };
  //定义无用参数
  const basePagination: Pagination = {
    current: 1,
    pageSize: 10,
    total: 0,
  };
  const pagination = reactive({
    ...basePagination,
    'hide-on-single-page': true,
    'show-total': true,
    'show-jumper': true,
    'show-page-size': true,
  });
  const rowSelection = reactive({
    type: 'checkbox',
    showCheckedAll: true,
    onlyCurrent: false,
  });
  const userIds = ref();

  const onPageChange = (current: number) => {
    pagination.current = current;
    fetchData();
  };
  const onPageSizeChange = (pageSize: number) => {
    pagination.pageSize = pageSize;
    fetchData();
  };
  const renderData = ref();

  const column = [
    {
      title: '评估名称',
      dataIndex: 'title',
    },
    {
      title: '评估时间',
      dataIndex: 'createTime',
    },
    {
      title: '治疗师',
      dataIndex: 'createUser',
    },
    {
      title: '操作',
      dataIndex: 'treatmentPlanId',
      slotName: 'treatmentPlanId',
    },
  ];
  // 查询评估详情
  const Evaluationshow = ref(false);
  const Evaluationdata = ref();
  const goevaluation = (item: { evaluationId: any }) => {
    evaluation({
      evaluationId: item.evaluationId,
    }).then((res) => {
      if (res.code == 200) {
        Evaluationdata.value = JSON.parse(res.data);
        console.log('查询评估详情成功', Evaluationdata.value);
        Evaluationshow.value = true;
      }
    });
  };
  const addFormshow = ref(false);
  const visibleshow = ref(false);

  const handleOk = () => {
    stopTreatment({
      patientTreatmentId: addForm.value.patientTreatmentId,
    })
      .then((res) => {
        if (res.code == 200) {
        }
      })
      .catch((error) => {
        console.error('请求失败:', error);
      });
  };
  const checkTime = (item) => {
    const timeFormatRegex = /^\d{2}:\d{2}-\d{2}:\d{2}$/;
    if (!timeFormatRegex.test(item)) {
      return '时间格式不正确';
    }

    const [startTimeItem, endTimeItem] = item.split('-');

    // 从 currentDate.value 中提取日期
    const currentDateObj = new Date(currentDate.value); // 当前日期对象

    // 构造新的日期对象，使用当前日期和给定的时间
    const startTimeParts = startTimeItem.split(':').map(Number);
    const endTimeParts = endTimeItem.split(':').map(Number);

    // 设置时、分、秒和毫秒为0
    const startDateTimeItem = new Date(
      currentDateObj.getFullYear(),
      currentDateObj.getMonth(),
      currentDateObj.getDate(),
      startTimeParts[0],
      startTimeParts[1],
      0,
      0
    );
    const endDateTimeItem = new Date(
      currentDateObj.getFullYear(),
      currentDateObj.getMonth(),
      currentDateObj.getDate(),
      endTimeParts[0],
      endTimeParts[1],
      0,
      0
    );

    // 检查日期是否有效
    if (
      isNaN(startDateTimeItem.getTime()) ||
      isNaN(endDateTimeItem.getTime())
    ) {
      return '时间格式不正确'; // 返回格式不正确的提示
    }

    // 如果没有其他时间段，直接返回可用
    if (resttimer.value.length <= 0) {
      return '时间可用';
    }

    for (const rest of resttimer.value) {
      const startDateTimeRest = new Date(rest.startTime);
      const endDateTimeRest = new Date(rest.endTime);

      // 检查 item 的时间段是否与 resttimer 的时间段重叠
      if (
        // 条件 1: item 的开始时间在 rest 的时间段内
        (startDateTimeItem >= startDateTimeRest &&
          startDateTimeItem < endDateTimeRest) ||
        // 条件 2: item 的结束时间在 rest 的时间段内
        (endDateTimeItem > startDateTimeRest &&
          endDateTimeItem <= endDateTimeRest) ||
        // 条件 3: item 完全覆盖 rest
        (startDateTimeItem <= startDateTimeRest &&
          endDateTimeItem >= endDateTimeRest) ||
        // 条件 4: item 和 rest 完全相等
        (startDateTimeItem === startDateTimeRest &&
          endDateTimeItem === endDateTimeRest) ||
        // 条件 5: item 的结束时间等于 rest 的开始时间
        endDateTimeItem === startDateTimeRest
      ) {
        return '时间已锁定';
      }
    }

    return '时间可用';
  };

  // 动态判断状态并返回对应的类名
  const getStatusClass = (timeRange, date) => {
    if (checkTime(timeRange) == '时间已锁定') {
      return 'suoding';
    }
    const [startTime, endTime] = timeRange.split('-'); // 分割时间区间
    const dateString = date.replace(/年|月|日/g, '-').replace(/-$/, ''); // 转换日期格式
    const now = new Date(); // 当前时间

    // 合成完整时间对象
    const startDateTime = new Date(`${dateString}T${startTime}`);
    const endDateTime = new Date(`${dateString}T${endTime}`);

    // 判断状态
    if (now < startDateTime) {
      return 'after'; // 当前时间在区间之前
    } else if (now >= startDateTime && now <= endDateTime) {
      return 'during'; // 当前时间在区间内
    } else {
      return 'before'; // 当前时间在区间之后
    }
  };

  // 处理状态分类统计数据
  function getPatientStatus(dayplandata, formattedDate) {
    const currentTime = new Date(); // 当前完整时间
    const formattedDateObject = new Date(formattedDate); // 输入的完整日期

    // 提取日期部分（清除时间）
    const currentDateOnly = new Date(
      currentTime.getFullYear(),
      currentTime.getMonth(),
      currentTime.getDate()
    );
    const formattedDateOnly = new Date(
      formattedDateObject.getFullYear(),
      formattedDateObject.getMonth(),
      formattedDateObject.getDate()
    );

    const statusCounts = {
      ongoing: 0,
      ended: 0,
      notStarted: 0,
    };

    for (const time in dayplandata) {
      const treatments = dayplandata[time];

      for (const treatment of treatments) {
        // 日期比较逻辑
        if (formattedDateOnly < currentDateOnly) {
          // 如果传入日期早于当前日期，全部计入 ended
          statusCounts.ended++;
        } else if (formattedDateOnly > currentDateOnly) {
          // 如果传入日期晚于当前日期，全部计入 notStarted
          statusCounts.notStarted++;
        } else {
          // 日期相等时，进行具体时间段比较
          const startTime = new Date(
            formattedDateObject.getFullYear(),
            formattedDateObject.getMonth(),
            formattedDateObject.getDate(),
            ...treatment.startTime.split(':').map(Number)
          ); // 转换开始时间
          const endTime = new Date(
            formattedDateObject.getFullYear(),
            formattedDateObject.getMonth(),
            formattedDateObject.getDate(),
            ...treatment.endTime.split(':').map(Number)
          ); // 转换结束时间

          if (currentTime >= startTime && currentTime < endTime) {
            statusCounts.ongoing++;
          } else if (currentTime >= endTime) {
            statusCounts.ended++;
          } else {
            statusCounts.notStarted++;
          }
        }
      }
    }

    return statusCounts;
  }
  // 返回上一页
  const gobackfn = () => {
    router.push({
      name: 'Scheduling',
    });
  };
</script>

<style scoped>
  .date-switcher {
    position: absolute;
    top: 30px;
    left: 50%;
    transform: translate(-50%, 0);
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: Arial, sans-serif;
    z-index: 999;
  }
  .date-switcher div {
  }
  .date-switcher div img {
    width: 32px;
    height: 32px;
  }
  .date-display {
    font-size: 30px;
    font-weight: 800;
  }
</style>
